<template>
	<view class="flex_box">
		<u-navbar :border-bottom="false" :title="btld" back-icon-color="#ffffff" :background="{background:'#2149c3'}"
			title-color="#ffffff"></u-navbar>
		<view class="soll_box">
			<view class="news_list">
				<view class="u-body-item u-flex u-border-bottom u-col-between u-p-t-0" v-for="item in newsList"
					@click="godatil(item)">
					<view class="u-body-item-title">
						<view class="u-line-2">{{item.title}}</view>
						<view class="ms_list">
							<!-- <view></view> -->
							<view>{{item.publishTime}}</view>
						</view>
					</view>
					<view v-if="type == 3">
						<view v-if="item.cover != null || item.cover != undefined " <image
							:src="imgurlhost + item.cover" mode="aspectFill">
							</image>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- <view style="padding:20rpx 0;" v-if="dataShow">
			<graceEmpty text="暂无数据" :iconSize="100" :iconType="4" iconColor="#9DD26D" textColor="#9DD26D"></graceEmpty>
		</view> -->
	</view>
</template>

<script>
	var _self;
	import {
		mapState,
		mapMutations
	} from 'vuex';
	import graceEmpty from "@/colorui/components/graceEmpty.vue";
	export default {
		data() {
			return {
				userInfoId: '',
				newsList: [],
				dataShow:false,
				page: {
					pagenum: 1,
					pagesize: 10
				},
				btld: '平台通知',
				type: 1,
				search: '',
				imgurlhost: ''
			};
		},
		components: {
			graceEmpty
		},
		onShow() {

		},
		onLoad(option) {
			this.search = option.search
			this.type = option.type;
			if (option.type == 1) {
				this.btld = '平台通知'
				this.selectAddress(this.type);
			} else if (option.type == 2) {
				this.btld = '系统消息'
				this.selectAddress(this.type);
			} else if (option.type == 3) {
				this.btld = '装修资讯'
				this.search = option.search;
				this.selectnewslist();
			} else {
				this.btld = ''
				this.selectAddress(this.type);
			}
		},
		//下拉刷新
		onPullDownRefresh: function() {
			this.page={
				pagenum: 1,
				pagesize: 10
			}
			this.newsList = [];
			if (this.type == 1) {
				this.btld = '平台通知'
				this.selectAddress(this.type);
			} else if (this.type == 2) {
				this.btld = '系统消息'
				this.selectAddress(this.type);
			} else if (this.type == 3) {
				this.btld = '装修资讯'
				this.search = this.search;
				this.selectnewslist();
			} else {
				this.btld = ''
				this.selectAddress(this.type);
			}
		},
		// 加载更多
		onReachBottom: function() {
			if (this.type == 1) {
				this.btld = '平台通知'
				this.selectAddress(this.type);
			} else if (this.type == 2) {
				this.btld = '系统消息'
				this.selectAddress(this.type);
			} else if (this.type == 3) {
				this.btld = '装修资讯'
				this.search = this.search;
				this.selectnewslist();
			} else {
				this.btld = ''
				this.selectAddress(this.type);
			}
		},
		computed: {
			...mapState(['userInfo', 'hasLogin', 'scene', 'openid'])
		},
		methods: {
			getData() {
				this.siteList = [{
					id: 1,
					realname: '游X',
					telephone: '183****5523',
					address: '广东省深圳市宝安区 自由路66号'
				}];
			},
			toAddSite() {
				uni.navigateTo({
					url: '/newpage/address/addSite'
				});
			},
			tapList: function(r) {
				uni.navigateTo({
					url: '/newpage/address/editSite?obj=' + JSON.stringify(r)
				});
			},
			selectAddress: function(type_num) {
				var hideload = 0;
				uni.showLoading();
				uni.request({
					url: this.serverUrl + 'app/getMessageList',
					header: {
						"content-type": "application/x-www-form-urlencoded; charset=UTF-8"
					},
					method: 'POST',
					data: {
						pageSize: this.page.pagesize,
						pageNum: this.page.pagenum,
						type: type_num
					},
					success: (r) => {
						console.log(r, 'getNewsList');
						if (r.data.code == 0) {
							// this.newsList = r.data.data
							var pageSum = Math.ceil(r.data.count/this.page.pagesize);
							console.log(pageSum,'pageSum')
							if (this.page.pagenum>pageSum) {
								console.log(this.page.pagenum,'this.page.pagenum')
								hideload = 1;
								uni.hideLoading();
								uni.showToast({
									title: "没有更多了",
									icon: "none",
									duration: 1500
								}); 
							}else{
								// this.dataShow = false;
								for (var i = 0; i < r.data.data.length; i++) {
									this.newsList = this.newsList.concat(r.data.data[i]);
								}
								console.log(this.newsList)
								this.page.pagenum++;
								uni.hideLoading();
							}
						}
					}
				})
			},
			selectnewslist: function(type_num) {
				this.imgurlhost = this.serverUrl;
				var hideload = 0;
				uni.showLoading();
				let params;
				if (this.search == undefined || this.search == '' || this.search == null) {
					params = {
						pageSize: this.page.pagesize,
						pageNum: this.page.pagenum
					}
				} else {
					params = {
						pageSize: this.page.pagesize,
						pageNum: this.page.pagenum,
						title: JSON.parse(this.search)
					}
				}
				uni.request({
					url: this.serverUrl + 'app/getNewsList',
					header: {
						"content-type": "application/x-www-form-urlencoded; charset=UTF-8"
					},
					method: 'POST',
					data: params,
					success: (r) => {
						console.log(r, 'getNewsList');
						if (r.data.code == 0) {
							var pageSum = Math.ceil(r.data.count/this.page.pagesize);
							console.log(pageSum,'pageSum')
							if (this.page.pagenum>pageSum) {
								console.log(this.page.pagenum,'this.page.pagenum')
								hideload = 1;
								uni.hideLoading();
								uni.showToast({
									title: "没有更多了",
									icon: "none",
									duration: 1500
								}); 
							}else{
								this.dataShow = false;
								// this.newsList = r.data.data
								for (var i = 0; i < r.data.data.length; i++) {
									this.newsList = this.newsList.concat(r.data.data[i]);
								}
								console.log(this.newsList)
								this.page.pagenum++;
								uni.hideLoading();
							}
						}
					}
				})
			},
			godatil: function(item) {
				if (this.type == 3) {
					uni.navigateTo({
						url: '/newpage/newdetail?id=' + item.id
					});
				}
			}
		}
	};
</script>

<style lang="scss" scoped>
	.news_list {
		padding: 20rpx 10rpx;
	}

	.news_list .u-body-item {
		display: flex;
		font-size: 30rpx;
		color: #333;
		padding: 20rpx 10rpx;
		align-items: center;
		padding-top: 40rpx;
		margin-bottom: 20rpx;
	}

	.u-body-item-title {
		flex: 1;
	}

	.news_list .u-body-item image {
		width: 160rpx;
		flex: 0 0 160rpx;
		height: 120rpx;
		border-radius: 10rpx;
		margin-left: 12rpx;
	}

	.news_list .u-line-2 {
		font-size: 30rpx;
		font-weight: normal;
		color: #333333;
		line-height: 34rpx;
	}

	.ms_list {
		display: flex;
		flex-direction: row;
		// justify-content: space-between;
		align-items: center;
		margin-top: 15rpx;
		font-size: 23rpx;
		font-weight: normal;
		color: #a2a5ac;
	}
</style>
